<template>
	<div class="tag">
		<el-tag
			:key="tag.path"
			v-for="(tag, index) in tagList"
			:closable="index != 0"
			@close="handleClose(tag)"
			@click="handleClick(tag)"
			style="float: left; margin: 0 0 0 5px"
			:effect="tag.path === $route.path ? 'dark' : 'light'"
		>
			{{ tag.label }}
		</el-tag>
	</div>
</template>

<script>
export default {
	name: "FrontAdminTag",
	props: {
		tagList: {
			type: Array,
			default: () => {
				return []
			},
		},
	},
	data() {
		return {}
	},
	methods: {
		handleClose(tag) {
			this.$emit("handler-close", tag)
		},
		handleClick(tag) {
			this.$emit("handler-click", tag)
		},
	},
}
</script>

<style scoped></style>
